<%@page import="transfer.User"%>
<%@page import="content.UserContent"%>
<%@page import="transfer.OrderState"%>
<%@page import="transfer.Warehouse"%>
<%@page import="content.WarehouseContent"%>
<%@page import="java.util.ArrayList"%>
<link rel="stylesheet" href="../css/jquery-ui.css" />
<script type="text/javascript" src="../js/jquery-ui.js"></script>
<script type="text/javascript" src="../js/helper.js"></script>
    <H3>Report Filter</H3>
<%
    ArrayList warehouses = WarehouseContent.getAllWarehouses();
    ArrayList states = OrderState.getAllStates();
    ArrayList users = UserContent.getAllCustomers();
%>
<table>
        <tr>
            <td width="90px"><H3>Creation Date:</H3></td>
            <td><input class="input-date" id="fromdatepicker" type="text" name="from-date"  > to <input id="todatepicker" class="input-date" type="text" name="to-date" ></td>
            <td><H3>Warehouse:</H3></td>
            <td>
                <select id="warehouse_selection">
                    <option id="">All</option>
                    <%
                        for (int i = 0; i < warehouses.size(); i++) {
                            Warehouse w = (Warehouse) warehouses.get(i);
                    %>
                        <option id="<%= w.getIdWarehouse() %>"><%= w.getNameWarehouse() %></option>
                    <%
                        }
                    %>
                </select>
            </td>
            <td><H3>Start:</H3></td>
            <td><input class="inp-amount" id="start_record" type="number" min="1" step="1" value="1" onkeydown = "javascript: return is_positive_int(event, $(this).val());"></td>            
        </tr>
        <tr>
            <td><H3>Customer:</H3></td>
            <td>
                <select id="customer_selection">
                    <option id="">All Customers</option>
                    <option id="0">Anonymous</option>
                    <%
                        for (int i = 0; i < users.size(); i++) {
                            User user = (User) users.get(i);
                    %>
                                <option id="<%= user.getIdUser() %>"><%= user.getFirstName() + " " +user.getLastName() + "("+ user.getLogin() +")" %></option>
                    <%
                        }
                    %>
                </select>
            </td>
            <td><H3>State:</H3></td>
            <td>
                <select id="state_selection">
                    <option id="">All States</option>
                    <%
                        for (int i = 0; i < states.size(); i++) {
                            OrderState state = (OrderState) states.get(i);
                            if (state.getIdOrderState() != OrderState.ID_ENTERING) {
                    %>
                                <option id="<%= state.getIdOrderState() %>"><%= state.getNameOrderState() %></option>
                    <%
                            }
                        }
                    %>
                </select>
            </td>
            <td><H3>Quantity:</H3></td>
            <td><input class="inp-amount" id="records_quantity" type="number" min="0" step="1" value="20" onkeydown = "javascript: return is_positive_int(event, $(this).val());"></td>
            <td><input type="button" class="btn-buy" value="Generate" id="generate_report" onclick="generateOrderReport()"></td>
        </tr>
    </table>

<div class="float_left" style="padding-left: 15px;">
    <div class="box" style="width: 900px;">
        <table class="table" id="report-table" rules=all>
            <tr>
                <td id="report_id" value="" onclick="sortOrderReport($(this).attr('id'))" >#<img id="report_id_img" src=""></td>
                <td id="report_order_id" value="id" onclick="sortOrderReport($(this).attr('id'))">Order ID<img id="report_order_id_img" src="../images/up.png"></td>
                <td id="report_order_state" value="state" onclick="sortOrderReport($(this).attr('id'))">Order State<img id="report_order_state_img" src=""></td>
                <td id="report_login" value="login" onclick="sortOrderReport($(this).attr('id'))">Login<img id="report_login_img" src=""></td>
                <td id="report_creation_date" value="create" onclick="sortOrderReport($(this).attr('id'))">Creation Date<img id="report_creation_date_img" src=""></td>
                <td id="report_warehouse_name" value="warehouse" onclick="sortOrderReport($(this).attr('id'))">Warehouse Name<img id="report_warehouse_name_img" src=""></td>
                <td id="report_total_cost" value="total" onclick="sortOrderReport($(this).attr('id'))">Total Cost<img id="report_total_cost_img" src=""></td>
            </tr>
        </table>
        <script>
            order_report_selected_id = 'report_order_id';
            direction = 'up';
            column = 'id';
            $("#fromdatepicker").datepicker();
            $("#todatepicker").datepicker();
        </script>
    </div>
</div>

